import { action, observable } from "mobx";
import { IconHeight, IconWidth } from "./Config";
import { IconData } from "./IconData";

export let icons: IconData[] = observable([
    {
        img: require("./res/computer.png").default,
        title: "我的电脑"
    },
    {
        img: require("./res/appStore.png").default,
        title: "应用市场"
    },
    {
        img: require("./res/recycle_full.png").default,
        title: "回收站"
    },
    {
        img: require("./res/folder_win10.png").default,
        title: "文件夹123123123"
    },
    {
        img: require("./res/folder_win10.png").default,
        title: "文件夹123"
    },
    {
        img: require("./res/folder_win10.png").default,
        title: "文件夹123"
    },
    {
        img: require("./res/folder_win10.png").default,
        title: "文件夹123"
    },
    {
        img: require("./res/folder_win10.png").default,
        title: "文件夹123"
    },
    {
        img: require("./res/folder_win10.png").default,
        title: "文件夹123"
    },
    {
        img: require("./res/folder_win10.png").default,
        title: "文件夹123"
    },
    {
        img: require("./res/folder_win10.png").default,
        title: "文件夹123文件夹123文件夹123文件夹123文件夹123"
    },
    {
        img: require("./res/7d31213143c55ab21d3e267ae0bb39a1_250.png").default,
        title: "猫猫"
    },
    {
        img: require("./res/96b32f57ae31bb21fb201f42ab1aff40.jpg").default,
        title: "贴图"
    },
    {
        img: require("./res/df4281e61583cd2f7eaa7265081318c4.png").default,
        title: "贴图"
    },
    {
        img: require("./res/wechart.png").default,
        title: "微信"
    },
]);

for (let icon of icons)
{
    icon.hover = false;
    icon.selected = false;
}

const UpdateIconPos = action(() =>
{
    let width = window.innerWidth;
    let height = window.innerHeight;

    let ycount = Math.floor((height - 15) / (IconHeight + 15));
    let xcount = Math.floor((width - 15) / (IconWidth + 15));

    if (xcount * ycount < icons.length)
    {
        ycount = (Math.floor(icons.length / (xcount || 1))) || 1;
        if (icons.length / ycount > xcount)
            ycount++;
    }

    let j = 0;
    let k = 0;
    for (let i of icons)
    {
        i.x = j * (IconWidth + 15) + 15;
        i.y = k * (IconHeight + 15) + 15;

        k++;
        if (k === ycount)
        {
            k = 0;
            j++;
        }
    }
});

UpdateIconPos();
window.addEventListener("resize", UpdateIconPos);

class DesktopStore
{
    @observable dragIng = false;

    startX: number;
    startY: number;
}

export const deskStore = new DesktopStore;
globalThis.desk = deskStore;
